<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:a4j="http://richfaces.org/a4j"
      xmlns:rich="http://richfaces.org/rich">


    <span style="text-align: left; font-weight: bold; font-size: 12px; color: #003366;">
	Gestión - Procesos
    </span>

    <h:form id="formR"><center>
	    <rich:panel style="width: 260px;">
		<h:panelGrid columns="2" style="vertical-align: top;">
		    <h:outputText value="Nombre"/>
		    <h:inputText value="#{gesPocesosBean.nombre}"  required="true"
				 requiredMessage="Se requiere un nombre" />

		    <h:outputText value="Fecha Inicio"/>
		    <a4j:outputPanel layout="block">
			<rich:calendar value="#{calendarBean.selectedDate}" id="calendar"
				       locale="#{calendarBean.locale}" popup="#{calendarBean.popup}"
				       datePattern="d/M/yy HH:mm"
				       showApplyButton="#{calendarBean.showApply}" style="width:200px"
				      >
			</rich:calendar>
		    </a4j:outputPanel>
		    <h:outputText value="Fecha Fin"/>
		    <a4j:outputPanel layout="block">
			<rich:calendar value="#{calendarBean2.selectedDate}" id="calendar2"
				       locale="#{calendarBean2.locale}" popup="#{calendarBean2.popup}"
				       datePattern="d/M/yy HH:mm"
				       showApplyButton="#{calendarBean2.showApply}" style="width:200px"
				      >
			</rich:calendar>
		    </a4j:outputPanel>
		    <a4j:commandButton action="#{gesPocesosBean.registrarProceso}" value="Registrar" style="text-align: center;">
			<a4j:ajax event="click" execute="@form"></a4j:ajax>
		    </a4j:commandButton>
		</h:panelGrid>
	    </rich:panel>

	</center>

	<center>
	    <a4j:status>
		<f:facet name="start">
		    <h:graphicImage value="/resourses/images/loading-bar.gif" alt="loading"/>
		</f:facet>
	    </a4j:status>
	</center>
    </h:form>

</html>